<template>
  <el-tree
    :data="editorStore.componentList"
    :props="defaultProps"
    draggable
    default-expand-all
    node-key="id"
    @node-click="handleNodeClick"
  />
</template>

<script lang="ts" setup>
defineOptions({
  name: "Tree",
});

import useEditorStore from "@/store/modules/editor";

const editorStore = useEditorStore();

const defaultProps = {
  children: "children",
  label: "package",
};

const handleNodeClick = (node) => {
  editorStore.setCurrentComponentId(node.id);
};
</script>

<style scoped lang="scss"></style>
